<template>
  <ly-dialog
    v-model="dialogVisible"
    :title="'修改密码'"
    width="560px"
    :before-close="handleClose"
  >
    <el-form
      :inline="false"
      :model="formData"
      :rules="rules"
      ref="rulesForm"
      label-position="right"
      label-width="130px"
    >
      <el-form-item label="账户名：" prop="username">
        <el-input
          v-model.trim="formData.username"
          placeholder="请输入账户名"
          style="width: 300px"
          :disabled="true"
        ></el-input>
      </el-form-item>

      <el-form-item label="手机号：" prop="mobile">
        <el-input
          v-model.trim="formData.mobile"
          placeholder="请输入手机号"
          style="width: 300px"
          :disabled="true"
        ></el-input>
      </el-form-item>

      <el-form-item label="修改密码：" prop="password">
        <el-input
          v-model.trim="formData.password"
          placeholder="请输入新密码"
          style="width: 300px"
          :disabled="loadingTitle == '详增'"
        ></el-input>
      </el-form-item>
    </el-form>
    <template #footer>
      <el-button @click="handleClose" :loading="loadingSave">取消</el-button>
      <el-button
        type="primary"
        @click="submitData"
        :loading="loadingSave"
        :disabled="loadingTitle == '详情'"
        >确定</el-button
      >
    </template>
  </ly-dialog>
</template>

<script>
import { staffAdd, staffUpdate, userupdate } from "@/api/api";
import { setStorage, getStorage } from "@/utils/util";
import LyDialog from "@/components/dialog/dialog.vue";
export default {
  emits: ["refreshData"],
  name: "addAdmin",
  components: { LyDialog },
  data() {
    return {
      dialogVisible: false,
      loadingSave: false,
      loadingTitle: "密码修改",
      formData: {
        username: "", //账号号
        password: "", //密码
        mobile: "", //手机号码
        region_name: "", // 所属区域
        group_name: "", //权限名称
        group_id: "", //权限id
        region_id: "", //地区id
        passwordEdit: "", //密码修改
      },
      rules: {
        region_name: [
          { required: true, message: "请输入地区名称", trigger: "blur" },
        ],
        username: [
          { required: true, message: "请输入账户名称", trigger: "blur" },
        ],
        password: [{ required: true, message: "请输入密码", trigger: "blur" }],
        passwordEdit: [
          { required: true, message: "请输入密码", trigger: "blur" },
        ],
        group_name: [
          { required: true, message: "请选择权限", trigger: "blur" },
        ],
        mobile: [{ required: true, message: "请输入手机号", trigger: "blur" }],
      },
      GroupList: [], //管理员分组列表
      AreaRootList: [], //区域列表获取
      passwordSwitch: false, //是否修改密码
    };
  },
  methods: {
    search(i, e) {
      console.log(e, "-------------this,eeeeeee");
      if (i === 1)
        this.formData.group_id = this.GroupList.find(
          (item) => item.name == e
        ).id;
      if (i === 2)
        this.formData.region_id = this.AreaRootList.find(
          (item) => item.region_name == e
        ).id;
    },
    handleClose() {
      this.dialogVisible = false;
      this.loadingSave = false;
      this.formData.password = "";
      this.passwordSwitch = false;
      this.$emit("refreshData");
    },
    addModuleFn(item, flag, GroupList) {
      this.loadingTitle = flag;
      this.dialogVisible = true;
      console.log();
    },

    submitDataOne() {
      let vm = this;

      this.$refs["rulesForm"].validate((obj) => {
        if (obj) { 
          vm.$confirm("您确定要进行密码修改吗?", {
            closeOnClickModal: false,
          })
            .then((res) => {
              userupdate({ password: vm.formData.password }).then((res) => {
                if (res.code == 1) {
                  vm.$message.success(res.msg);
                  vm.handleClose();
                } else {
                  vm.$message.warning(res.msg);
                }
              });
            })
            .catch(() => {});
        }
      });
    },
    submitData() {
      let vm = this;
      if (vm.passwordSwitch && vm.formData.passwordEdit) {
        vm.$confirm("您修改了改用户的原始密码，您确定要进行密码修改吗?", {
          closeOnClickModal: false,
        })
          .then((res) => {
            vm.submitDataOne();
          })
          .catch(() => {});
      } else {
        vm.submitDataOne();
      }
    },
    imgBeforeUpload(file) {
      const isJPG = file.type === "image/jpeg" || file.type === "image/png";
      if (!isJPG) {
        this.$message.error("图片只能是 JPG/PNG 格式!");
        return false;
      }
      return isJPG;
    },
    // async imgUploadRequest(param) {
    //     var vm = this
    //     let obj= await platformsettingsUploadPlatformImg(param)
    //     if(obj.code == 1) {
    //         let res=''
    //         if (obj.data.data[0].indexOf("://")>=0){
    //             res = obj.data.data[0]

    //         }else{
    //             res = url.split('/api')[0]+obj.data.data[0]
    //         }
    //         vm.formData.default_image = res
    //     } else {
    //         vm.$message.warning(res.msg)
    //     }
    // },
    imgUploadSuccess(res) {
      // if (res) {
      //     this.formData.image = res.url
      // }
    },
  },
  created() {
    this.userinfoObjs = { ...JSON.parse(getStorage("userinfo")) };
    //this.getAreaRoot()
    this.formData.username = this.userinfoObjs.username;
    this.formData.mobile = this.userinfoObjs.mobile;
  },
};
</script>
<style scoped>
.avatar-uploader .el-upload {
  border: 1px dashed #d9d9d9;
  border-radius: 6px;
  cursor: pointer;
  position: relative;
  overflow: hidden;
}
.avatar-uploader .el-upload:hover {
  border-color: #409eff;
}
.avatar-uploader-icon {
  font-size: 28px;
  color: #8c939d;
  width: 128px;
  height: 128px;
  line-height: 128px;
  text-align: center;
}
.avatar {
  width: 128px;
  height: 128px;
  display: block;
}
</style>

